import "./ZenUI.css";
import loadingIcon from "@module/../imgs/loading.gif";
/**
 * ZenUI
 * @module ZenUI
 *
 */
let ZenUI = {
    loadingEle: null,
    removeLoadingTimeId: 0,
    /**
     * show toast
     * @param {string}   text   [description]
     * @param {object}   options   [description]
     * @param {number}   timeLimit second
     * options
     * {
     * className:"",
     * content:""
     * }
     * @param {Function} cb        [description]
     * @example
     * ZenUI.ST('test',3);
     */
    ST(text, timeLimit, cb, options) {
        let defaultClassName = "zen_toast";
        let bodyEle = document.getElementsByTagName("body")[0];
        let toastEle = document.createElement("div");
        Uts.addClass(toastEle, defaultClassName);
        if (options && options.className) {
            Uts.addClass(toastEle, options.className);
        }
        // ReactDOM.render(<Content />, document.getElementById("reactRoot"));
        toastEle.innerHTML = (options && options.content) || text;
        Uts.addDom("append", bodyEle, toastEle);
        let removeSecond = timeLimit * 1000 || 3000;
        setTimeout(function() {
            Uts.addClass(toastEle, "zen_hide");
            Uts.removeDom(toastEle);
            Uts.isFunction(cb) && cb();
        }, removeSecond);
    },
    /**
     * show loading [lock screen]
     * @param {number}  timeLimit    [description]
     * @param {string}  text         [description]
     * @param {boolean} showBackDrop [description]
     * @example
     * ZenUI.SL(3,'正在获取用户信息');
     */
    SL(timeLimit, text, showBackDrop) {
        function removeSLElment() {
            if (ZenUI.loadingEle) {
                Uts.addClass(ZenUI.loadingEle, "zen_hide");
                Uts.removeDom(ZenUI.loadingEle);
                ZenUI.loadingEle = null;
            }
        }
        let removeSecond = timeLimit * 1000 || 3000;
        if (ZenUI.loadingEle) {
            ZenUI.removeLoadingTimeId &&
                clearTimeout(ZenUI.removeLoadingTimeId);
            ZenUI.removeLoadingTimeId = setTimeout(function() {
                removeSLElment();
            }, removeSecond);
            return false;
        }
        //create element to lock screen
        let defaultWrapClassName = "zen_loading-wrap";
        let defaultClassName =
            "zen_loading zen_ps-fix zen_z-i-999 zen_auto-center";
        let defaultText = "数据加载中...";
        text = text || defaultText;
        let bodyEle = document.getElementsByTagName("body")[0];
        let loadingEle = document.createElement("div");
        Uts.addClass(loadingEle, defaultWrapClassName);

        let loadingBody = document.createElement("div");
        loadingBody.innerHTML = `<img src="${loadingIcon}" alt="" />${text}`;
        if (showBackDrop) {
            let backDropElement = document.createElement("div");
            Uts.addClass(backDropElement, "zen_backdrop zen_full zen_z-i-999");
            Uts.addDom("prepend", loadingEle, backDropElement);
        } else {
        }
        Uts.addClass(loadingBody, "zen_loading-no-backdrop");
        Uts.addClass(loadingBody, defaultClassName);
        Uts.addDom("append", loadingEle, loadingBody);
        Uts.addDom("append", bodyEle, loadingEle);
        ZenUI.loadingEle = loadingEle;
        ZenUI.removeLoadingTimeId = setTimeout(function() {
            removeSLElment();
        }, removeSecond);
    },
    /**
     * hide loading
     */
    HL() {
        if (ZenUI.loadingEle) {
            Uts.removeDom(ZenUI.loadingEle);
            ZenUI.loadingEle = null;
        }
    }
};

global.ZenUI = ZenUI;

export default ZenUI;
